<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <title>订单</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <!--responsive-->
    <link rel="shortcut icon" href="../Content/img/jridge.ico" />
    <link rel="bookmark" href="../Content/img/jridge.ico" />
    <script src="../Scripts/jquery-1.10.2.min.js"></script>
    <script src="../Scripts/clipboard-polyfill.js"></script>
    <!--vue-->
    <script src="../Scripts/vue-2.5.9/vue.min.js"></script>
    <!--axios-->
    <script src="../Scripts/vue-2.5.9/axios.min.js"></script>
    <!--elementUI-->
    <script src="Scripts/element-2.3.8/index.js"></script>
    <link rel="stylesheet" href="Scripts/element-2.3.8/index.css">
    <!--Mint-UI-->
    <script src="Scripts/mint-ui/index.js"></script>
    <link rel="stylesheet" href="Scripts/mint-ui/style.css">
    <!--custom-->
    <link rel="stylesheet" href="../Content/vue-common.css">
    <script src="../Scripts/service/vue-service.js"></script>
    <style>
        .orderList {
            line-height: 100%;
        }

        .orderList li {
            margin: 3px auto;
        }

        #orderName {
            /* font-weight: bold; */
            font-size: 14px
        }

        #orderNo,
        #orderDeliverydate {
            color: #999999;
            font-size: 11px;
        }
    </style>
</head>

<body>
    <div id="app">
        <mt-header title="订单">
            <router-link to="/" slot="left">
                <mt-button icon="back" @click="window.location.href='./app_index.html'">返回</mt-button>
            </router-link>
            <mt-button slot="right" @click="addorder">
                <i class="el-icon-plus"></i>
            </mt-button>
        </mt-header>
        <el-row style="margin:10px 15px;">
            <!--筛选-->
            <el-radio-group v-model="filter" @change="getData()" size="small" style="margin-bottom:10px">
                <el-radio-button label="待审核"></el-radio-button>
                <el-radio-button label="审核中"></el-radio-button>
                <el-radio-button label="已发布"></el-radio-button>
            </el-radio-group>
            <el-collapse>
                <el-collapse-item v-for="(item,index) in currentData" :key="index">
                    <template slot="title">
                        <ul class="orderList">
                            <li id="orderName">{{item.properties.name}}</li>
                            <li id="orderNo">订单号：{{item.properties.orderno}}</li>
                            <li id="orderDeliverydate">交付时间：{{item.properties.deliverydate}}</li>
                        </ul>
                    </template>
                    <el-row>
                        <el-col :span="6">
                            订单数量：
                        </el-col>
                        <el-col :span="6">
                            {{item.properties.orderquantity}}
                        </el-col>
                        <el-col :span="6">
                            采购商：
                        </el-col>
                        <el-col :span="6">
                            {{item.properties.customer}}
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="6">
                            创建人：
                        </el-col>
                        <el-col :span="6">
                            {{item.properties.creator}}
                        </el-col>
                        <el-col :span="6">
                            创建时间：
                        </el-col>
                        <el-col :span="6">
                            {{item.properties.creationdate}}
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="6">
                            描述：
                        </el-col>
                        <el-col :span="6">
                            {{item.properties.description}}
                        </el-col>
                        <el-col :span="6">
                            优先级：
                        </el-col>
                        <el-col :span="6">
                            {{item.properties.priority}}
                        </el-col>
                    </el-row>
                </el-collapse-item>
            </el-collapse>
        </el-row>

        <!--新增订单填写弹出框-->
        <el-dialog title="新增订单" :visible.sync="addDialog" style="width:160%;margin-left:-30%" :close-on-click-modal="false" :close-on-press-escape="false">
            <el-form :model="addCurrent">

                <el-form-item label="产品名称" label-width="80px">
                    <el-input v-model="addCurrent.name" auto-complete="off"></el-input>
                </el-form-item>

                <el-form-item label="交付时间" label-width="80px">
                    <!-- <el-date-picker style="width: 100%" v-model="addCurrent.deliverydate" type="date" placeholder="选择日期">
                    </el-date-picker> -->
                    <el-input v-model="addCurrent.deliverydate" @focus="openPicker()" readonly></el-input>
                </el-form-item>

            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="addDialog = false">取 消</el-button>
                <el-button type="primary" @click="saveOrder">确 定</el-button>
            </div>
        </el-dialog>

        <mt-datetime-picker ref="picker" type="date" v-model="deliverydateInit" year-format="{value} 年" month-format="{value} 月"
            date-format="{value} 日" @confirm="formateDate(deliverydateInit)">
        </mt-datetime-picker>
    </div>
</body>
<script src="addorder.js"></script>
<script src="../Template/vue-components.js"></script>

</html>